import { CommandDialog } from '@amcax/base';
import i18n from '@app-cad/common/utils/i18next';
import { CurvedBaseCommand, CurvedCmdDialogParams } from '@app-cad/types';
import { Select } from 'antd';
import { useEffect, useState } from 'react';
import { CommandLabeledItemWrapper } from '@app-cad/common/components/command-form/item-wrapper';
import { PlaneOffset } from '@app-cad/environments/nextcad/commands/curved/cmd-plane/plane-offset';
import { PlanePoint } from '@app-cad/environments/nextcad/commands/curved/cmd-plane/plane-point';

const CommandElecPlane = ({ title, onClose, props }: CurvedCmdDialogParams) => {
  const [mode, setMode] = useState<'point-tr' | 'translate'>('point-tr');

  // props需要为state，以确保props和mode同时更新，分发的模式不会收到错误的props
  const [editProps, setEditProps] = useState<any>();
  const [editDxid, setEditDxid] = useState<string>();

  useEffect(() => {
    setMode(props?.params?.mode ?? 'point-tr');
    setEditProps(props);
    setEditDxid(props?.shape);
  }, [props?.shape]);

  return (
    <CommandDialog
      title={title}
      onClose={onClose}
      placement='topLeft'>
      <CommandLabeledItemWrapper
        className='mt-5 px-5'
        label='平面类型'>
        <Select
          options={[
            { value: 'point-tr', label: '平行通过点' },
            { value: 'translate', label: '偏移平面' },
          ]}
          value={mode}
          onChange={(val) => {
            if (val !== mode) {
              setMode(val);
              setEditProps(null);
            }
          }}
        />
      </CommandLabeledItemWrapper>
      {mode === 'point-tr' && (
        <PlanePoint
          props={editProps}
          onClose={onClose}
          editDxid={editDxid}
        />
      )}
      {mode === 'translate' && (
        <PlaneOffset
          props={editProps}
          onClose={onClose}
          editDxid={editDxid}
        />
      )}
    </CommandDialog>
  );
};

export const cmdElecPlane: CurvedBaseCommand = {
  id: 'CmdElecPlane',
  label: 'command.elecPlane',
  icon: 'commands/curved/plane',
  create: (label, onClose, props) => (
    <CommandElecPlane
      title={i18n.t(label)}
      onClose={onClose}
      props={props}
    />
  ),
};
